{% extends 'registration/registration_base.html' %}
{% load humanize %}
{% load widget_tweaks %}


{% block meta_title %}Create Account · FireCARES{% endblock %}

{% block meta_description %}
Create an account on FireCARES to learn how fire department resources are deployed to match your community risks.
{% endblock %}

{% block content %}
<div class="col-md-6 hidden-xs hidden-sm">
    <div class="ct-headerText--normal">
        <h2 class="text-uppercase ct-fw-600 ct-u-marginBottom20">
            <span class="ct-u-text--motive">FireCARES</span> Registration
        </h2>
        <p>Congratulations!  Your email address allows you to be able to register automatically.  Please complete the registration form to create your account.</p>
    </div>
</div>

<div class="col-md-6">
    <form role="form" class="ct-formRegister pull-right-md" method="post" action="">
        {% csrf_token %}
        <div class="form-group">
            <div class="ct-form--label--type2">
                <div class="ct-u-displayTableVertical">
                    <div class="ct-u-displayTableCell">
                        <div class="ct-input-group-btn">
                            <button class="btn btn-primary">
                                <i class="fa fa-user"></i>
                            </button>
                        </div>
                    </div>
                    <div class="ct-u-displayTableCell text-center">
                        <span class="text-uppercase">Register for FIRECARES</span>
                    </div>
                </div>
            </div>
            {% with WIDGET_ERROR_CLASS='form-error' %}
            <div class="ct-form--item ct-u-marginBottom20 form-group">
                <label>Your Username</label>
                {% render_field form.username type="text" class+="form-control input-lg" %}
                {{ form.username.errors }}
            </div>
            <div class="ct-form--item ct-u-marginBottom20 form-group">
                <label>Your First Name</label>
                {% render_field form.first_name type="text" class+="form-control input-lg" %}
                {{ form.first_name.errors }}
            </div>
            <div class="ct-form--item ct-u-marginBottom20 form-group">
                <label>Your Last Name</label>
                {% render_field form.last_name type="text" class+="form-control input-lg" %}
                {{ form.last_name.errors }}
            </div>
            <div class="ct-form--item ct-u-marginBottom20 form-group">
                <label>Your Email</label>
                {% render_field form.email type="text" class+="form-control input-lg" disabled="disabled" %}
                {{ form.email.errors }}
            </div>
            <div class="ct-form--item ct-u-marginBottom20 form-group">
                <label>Password</label>
                {% render_field form.password1 type="password" class+="form-control input-lg" %}
                {{ form.password1.errors }}
            </div>
            <div class="ct-form--item ct-u-marginBottom20 form-group">
                <label>Password Confirmation</label>
                {% render_field form.password2 type="password" class+="form-control input-lg" %}
                {{ form.password2.errors }}
            </div>
            {{ form.non_field_errors }}
            {% endwith %}
            <div class="ct-form--item">
                <button type="submit" class="btn btn-warning center-block">Register</button>
            </div>
        </div>
    </form>
</div>
{% endblock %}
